<!-- 
 * 需求管理
 * @author: 冯宇
 * @since: 2022-05-16
 * index.vue
-->
  <template>
  <div class="invest-manage-container h100">
    <router-view v-show="routerCutLevel === 3" class="detailsPage"></router-view>
    <div v-show="routerCutLevel === 2" class="listPage">
      <Filters :formModel="data.formModel" :formLabel="data.formLabel" @reset="resizeForm" @filter="getInvestList">
      </Filters>

      <TableCom :tableHeader="data.tableHeader" :tableData="data.tableData" :btnData="data.btnData"
        @getCurrentChange="getCurrentChange" @getSizeChange="getSizeChange" @comEvent="comEvent"
        @getSelectChange="getSelectChange" :isShowCheckbox="true" @colSelect="colSelect" @refresh="refreshTable"
        :pagination="data.pagination" :loading="data.loading" handleWidth="335">
        <el-button v-for="(item, index) in data.btnList" :key="index" class="tableBtnCss"
          :style="{ backgroundColor: item.bgColor }" @click="userManageBtnList(index)">
          <svg-icon :name="item.icon" v-if="item.icon"></svg-icon>
          {{ item.name }}
        </el-button>
      </TableCom>

    <!-- 上传文件 -->
    <el-dialog v-model="isShowLead" title="投资机构导入" width="30%" :before-close="() => (isShowLead = false)">
      <uploadDownload @upload="uploadFile"></uploadDownload>
    </el-dialog>
    </div>
  </div>
</template>

<script setup>
import { reactive, computed ,ref} from 'vue'
import { getDictListApi, getDictItemListApi, getRegionApi, getDomainApi } from '@/api/public/publicDict.js'
import { getInvestListApi, operateInvestApi } from '@/api/interface/investOrganization.js'

import { ElMessageBox, ElMessage } from 'element-plus'

import { colFilters, batchHandle, lineHandle } from '@/utils/common.js'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
const router = useRouter()
const store = useStore()
const isShowLead = ref(false)

const routerCutLevel = computed(() => {
  return store.getters['setting/routerCutLevel']
})



const data = reactive({
  formModel: {
    organizationName: '',
    creditCode: '',
    industry: '',
    operatingStatus: '',
    provinceCode: '',
    registeCapital: '',
    valid: '',
  },
  formLabel: [
    {
      label: '机构名称',
      model: "organizationName",
      type: "text",
      width: '160',
      placeholder: '请输入机构名称',
    },
    {
      label: '统一社会信用代码',
      model: "creditCode",
      type: "text",
      width: '160',
      placeholder: '请输入统一社会信用代码',
    },
    {
      label: '主投技术领域',
      model: "industry",
      type: "select",
      width: '160',
      option: [
        {
          key: '全部',
          value: ''
        },
      ],
    },
    {
      label: '经营状态',
      model: "operatingStatus",
      type: "select",
      width: '160',
      option: [
        {
          key: '全部',
          value: ''
        },
        {
          key: '存续',
          value: '存续'
        },
        {
          key: '注销',
          value: '注销'
        },
      ],
    },
    {
      label: '机构所在地',
      model: "provinceCode",
      type: "select",
      width: '160',
      option: [
        {
          key: '全部',
          value: ''
        },
      ],
    },
    {
      label: '注册资金(万元)',
      model: "registeCapital",
      type: "select",
      width: '160',
      option: [
        {
          key: '全部',
          value: ''
        },
        {
          key: '小于1000万',
          value: '1'
        },
        {
          key: '1000-2000万',
          value: '2'
        },
        {
          key: '2000-5000万',
          value: '3'
        },
        {
          key: '5000万以上',
          value: '4'
        },
      ],
    },
    {
      label: '是否启用',
      model: "valid",
      type: "select",
      width: '160',
      option: [
        {
          key: '全部',
          value: ''
        },
        {
          key: '启用',
          value: true
        },
        {
          key: '禁用',
          value: false
        },
      ],
    },
  ],
  btnList: [
    {
      name: '新增投资机构',
      bgColor: '#25D390',
    },
    // {
    //   name: '投资机构导入',
    //   bgColor: '#00A2FF',
    // },
    // {
    //   name: '导出全量投资机构',
    //   bgColor: '#00A2FF',
    // },
    // {
    //   name: '导出选中投资机构',
    //   bgColor: '#00A2FF',
    // },
    {
      name: '批量启用',
      bgColor: '#00A2FF',
    },
    {
      name: '批量禁用',
      bgColor: '#FFB018',
    },
    {
      name: '批量删除',
      bgColor: '#F74B33',
    },
  ],
  tableHeader: [
    {
      label: '机构名称',
      prop: 'name',
      isLink: true,
      function: 'detail'
    },
    {
      label: '机构商标',
      prop: "logoUrl",
      isImg: true,
    },
    {
      label: '统一编码',
      prop: 'credit_no',
    },
    {
      label: '机构所在地',
      prop: 'provinceName',
    },
    {
      label: '注册资金（万元）',
      prop: 'regist_capi_new',
    },
    {
      label: '经营状态',
      prop: 'status',
    },
    {
      label: '主投技术领域',
      prop: 'investField',
    },
  ],
  tableData: [],
  btnData: [
    {
      name: '编辑',
      color: '#25D390',
      change: 'edit',
    },
    {
      name: '删除',
      color: '#F74B33',
      change: 'del',
    },
    {
      name: '是否启用',
      isStart: true,
      prop: 'valid',
      change: 'enable',
    },
    {
      name: '是否热门',
      isStart: true,
      prop: 'isHot',
      change: 'hot'
    },
    {
      name: '是否推荐',
      isStart: true,
      prop: 'isRecommend',
      change: 'recommend'
    },
  ],
  currentSelectList: [],
  pagination: {
    currentPage: 1,
    size: 10,
    total: 0,
  },
  loading:false,
})


//获取/搜索投资机构列表
const getInvestList = () => {
  data.loading = true
  const params = {
    // orderType: 'desc',
    // orderField: 'publishDate',
    keyword: data.formModel.organizationName,
    industryDistribution: data.formModel.industry,
    provinceCode: data.formModel.provinceCode,
    status: data.formModel.operatingStatus,
    valid: data.formModel.valid,
    registCapi: data.formModel.registeCapital,
    creditNo: data.formModel.creditCode,
    ipi: data.pagination.currentPage,
    ips: data.pagination.size,
  }
  getInvestListApi(JSON.stringify(params)).then(res => {
    if (res.status === 200) {
      const dataArr = res.data.result
      .map(v => {
        v.investField = v.industry_distribution_l1.map(vv => vv.name).join(',')
        return v
      })
      data.tableData = dataArr
      data.loading = false
      data.pagination.total = res.data.total
    }
  })
}
getInvestList()
//重置
const resizeForm = () => {
  for (let key in data.formModel) {
    data.formModel[key] = ''
  }
  getInvestList()
}




//需求类别、需求预算下拉框
const getNeedTypeSelectList = async () => {
  const dict = {
    ipi: 1,
    ips: 20,
    keyName: '',
  }
  const arr = await getDictListApi(dict).then((res) => {
    if (res.status === 200) {
      return res.data.result
    }
  })
  arr.forEach((v) => {
    if (v.keyId == 'DICT_INDUSTRY') {
      let needTypeDict = {
        dictType: v.keyId,
      }
      getDictItemListApi(needTypeDict).then((res) => {
          if (res.status === 200) {
            let arr = res.data.result.map(v => ({
              key: v.keyName,
              value: v.keyId
            }))
            for (let v of data.formLabel) {
              if (v.model == 'industry') {
                v.option = [...v.option, ...arr]
                break
              }
            }
          }
      })
    }
  })
}
getNeedTypeSelectList()
//获取省级行政区数据
const getRegion = () => {
  getRegionApi({ criSuperiorCode: '000000' }).then((res) => {
    if (res.status === 200) {
      let arr = res.data.map(v => ({
        key: v.criName,
        value: v.criCode
      }))
      for (let v of data.formLabel) {
        if (v.model == 'provinceCode') {
          v.option = [...v.option, ...arr]
          break
        }
      }
    }
  })
}
getRegion()




//列筛选
const colSelect = (headerArr, type, e, currentItem) => {
  if (type === 'filter') {
    const currentData = colFilters(headerArr, e, currentItem, data.tableHeader)
    data.tableHeader = currentData
  } else {
    //全选/全取消
    data.tableHeader = headerArr
  }
}
//刷新
const refreshTable = () => {
  getInvestList()
}
//表头功能
const userManageBtnList = (index) => {
  switch (index) {
    case 0:
      router.push({ name: 'AddInvest' })
      break
    // case 1:
    //   isShowLead.value = true
    //   console.log('通过文件批量导入')
    //   break
    // case 2:
    //   data.dialogUpload = true
    //   console.log('导出全部')
    //   break
    // case 3:
    //   data.dialogUpload = true
    //   console.log('导出选中')
    //   break
    case 1:
      const startArr = data.currentSelectList.map(v => v.id)
      const startFunction = () => {
        const params = { batchType: 'START', ids: startArr }
        operateInvestApi(JSON.stringify(params)).then(res => {
          if (res.status === 200) {
            ElMessage({
              message: res.message,
              type: 'success',
            })
            getInvestList()
          }
        })
      }
      batchHandle(startArr, 'START', startFunction)
      break
    case 2:
      const stopArr = data.currentSelectList.map(v => v.id)
      const stopFunction = () => {
        const params = { batchType: 'STOP', ids: stopArr }
        operateInvestApi(JSON.stringify(params)).then(res => {
          if (res.status === 200) {
            ElMessage({
              message: res.message,
              type: 'success',
            })
            getInvestList()
          }
        })
      }
      batchHandle(stopArr, 'STOP', stopFunction)
      break
    case 3:
      const delArr = data.currentSelectList.map(v => v.id)
      const delFunction = () => {
        const params = { batchType: 'DEL', ids: delArr }
        operateInvestApi(JSON.stringify(params)).then(res => {
          if (res.status === 200) {
            ElMessage({
              message: res.message,
              type: 'success',
            })
            getInvestList()
          }
        })
      }
      batchHandle(delArr, 'DEL', delFunction)
      break
    default:
      break
  }
}
//勾选机构
const getSelectChange = (row) => {
  data.currentSelectList = row
}
//分页查看
const getCurrentChange = (cur) => {
  data.pagination.currentPage = cur
  getInvestList()
}
//每页条数
const getSizeChange = (cur) => {
  data.pagination.size = cur
  getInvestList()
}


//上传文件
const uploadFile = (data) => {
  console.log(data, 'data');

}



//行内功能
const comEvent = (type, row) => {
  if (type == 'detail') {
    router.push({ name: 'InvestDetail', params: { id: row.id } })
  }
  else if (type == 'edit') {
    router.push({ name: 'EditInvest', params: { id: row.id } })
  }
  else if (type == 'del') {
    const delFunction = () => {
      let params = {
        batchType: 'DEL',
        ids: [row.id],
      }
      operateInvestApi(JSON.stringify(params)).then((res) => {
        if (res.status === 200) {
          ElMessage({
            message: res.message,
            type: 'success',
          })
          getInvestList()
        }
      })
    }
    lineHandle(row, 'del', delFunction)
  }
  else if (type == 'enable') {
    const validFunction = () => {
      let params = {
        batchType: row.valid ? 'STOP' : 'START',
        ids: [row.id],
      }
      operateInvestApi(JSON.stringify(params)).then((res) => {
        if (res.status === 200) {
          ElMessage({
            message: res.message,
            type: 'success',
          })
          row.valid = !row.valid
        }
      })
    }
    lineHandle(row, 'valid', validFunction)
  }
  else if (type == 'hot') {
    const hotFunction = () => {
      let params = {
        batchType: row.isHot ? 'STOP_HOT' : 'START_HOT',
        ids: [row.id],
      }
      operateInvestApi(JSON.stringify(params)).then((res) => {
        if (res.status === 200) {
          ElMessage({
            message: res.message,
            type: 'success',
          })
          row.isHot = !row.isHot
        }
      })
    }
    lineHandle(row, 'isHot', hotFunction)
  }
  else if (type == 'recommend') {
    const recommendFunction = () => {
      let params = {
        batchType: row.isRecommend ? 'STOP_RECOMMENDED' : 'START_RECOMMENDED',
        ids: [row.id],
      }
      operateInvestApi(JSON.stringify(params)).then((res) => {
        if (res.status === 200) {
          ElMessage({
            message: res.message,
            type: 'success',
          })
          row.isRecommend = !row.isRecommend
        }
      })
    }
    lineHandle(row, 'isRecommend', recommendFunction)
  }
}


</script>

<style lang="scss" scoped>
</style>